.comment{
  background: #fff;
}
.indexaddbox{
    a[href]:hover{
        color: #007bff;
    }
   .next,.prev{
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translate(0%,-50%);
    z-index: 1;
        i{
            width: 10px;
            height: 10px;
            background-color: transparent; /* 模块背景为透明 */
            border-color: #fff;
            border-style: solid;
            border-width: 3px 3px 0 0;
            transform: rotate(45deg);
            position: relative;
            display: block;
        }
   }
   .prev{
    right: inherit;
     left: 10px;
     i{
        transform: rotate(-135deg);
     }
   }
   .Iaddtitle{
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    .bt{
        float: left;
        font-size: 16px;
        margin-right: 20px;
        color: #000;
        font-weight: bold;
        position: relative;
       i{
            width: 3px;
            height: 16px;
            background: #007bff;
            display: inline-block;
            vertical-align: middle;
            margin: -2px 5px 0 0;
        }
    }
    .tab{
        cursor: pointer;
        i{
            width: 100%;
            height: 2px;
            left: 0;
            position: absolute;
            bottom: 0px;
            margin: 0;
            display: none;
        }
        &.on{
           i{
            display: block;
           }
        }
        .eye{
            display: inline-block;
            vertical-align: middle;
            height: 22px;
            width: 22px;
            background-position: -458px -187px;
            margin: -2px 5px 0 0;
            transform: scale(0.8);
        }
    }
    .more{
        float: right;
        font-size: 12px;
        color: rgba(0, 0, 0, 0.6);
        &:hover{
            color: #007bff;
        }
    }
    &.small{
        .bt{
            font-size: 15px;
            font-weight: normal;
        }
    }
   }
   .step-lis{
      ul{
        border-left: 1px solid rgba(0, 0, 0, 0.1);
        padding-left: 10px;
        margin-top: 10px;
        position: relative;
        li{
            position: relative;
            padding-bottom: 5px;
            &:hover{
                .ico{
                    border-color: #007bff;
                }
            }
            .ico{
                border:1px solid rgba(0, 0, 0, 0.1);
                background: #fff;
                border-radius: 50%;
                width: 8px;
                height: 8px;
                position: absolute;
                left: -16px;
                top: 7px;
                &::before{
                    content: '';
                    display: block;
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%);
                    background: #007bff;
                    width: 3px;
                    height: 3px;
    
                }
            }
            .bt{
                line-height: 24px;
                display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     
                overflow: hidden;
            }
            .time{
                color: rgba(23, 23, 23,0.4);
                font-size: 12px;
                line-height: 20px;
                height: 20px;
                overflow: hidden;
                padding-top: 3px;

            }
        }
        
      }
   }
   .indexaddtitle{
    display: flex;
    border-bottom: 1px solid rgba(0, 123, 255,0.3);
    height: 35px;
    line-height: 35px;
    padding: 0 15px;
    position: relative;
    .prev,.next{
        cursor: pointer;
        i{
            border-color: #007bff;
        }
    }
    .prev{left: 0px;}
    .next{right: 0px;}
    .switchlab{
        flex: 1;
        overflow: hidden;
        font-size: 16px;
        width: 1000px;
        .tab{
           display: block;
           float: left;
            margin: 0 5px;
            padding: 0 2px;
            font-weight: bold;
            cursor: pointer;
            position: relative;
            height: 100%;
            width: auto !important;
            &:hover{
                color: #007bff;
                a{
                    color: #007bff;
                }
            }
        }
        .on{  
            a{
                    color: #007bff;
                }
            &::before{
                width: 3px;
                height: 3px;
                background: #007bff;
                display: block;
                left: 50%;
                bottom: 0px;
                content: '';
                position: absolute;
            }
        }
    }
   }
}
.indexADD1{
  .indexADD1-1{
    width: 300px;
    .hdwrap {
         width: 300px; height: 215px; overflow: hidden;  
         padding-bottom: 10px;
         &:hover{
            .next,.prev{
                display: block;
            } 
        }
        .next,.prev{
            background: rgba(0, 0, 0, 0.7);
            width: 30px;
            height: 60px;
            cursor: pointer;
            border-radius: 5px;
            display: none;
            &:hover{
               background: rgba(0, 123, 255,0.5);
            }
            i{
               position: absolute;
               top: 0%;
               right: 0;
               bottom: 0;
               margin: auto;
               left: 0;
            }
       
           }
           .prev{
               i{
                   right: -5px;
               }
           }
           .next{
              i{
               right: 5px;
              }
           }
           .ban { width: 300px; height: 215px; position: relative; overflow: hidden; margin: 0 auto; }
           .ban2 { width: 300px; height: 175px; position: relative; overflow: hidden; }
           .ban2 .lis { width: auto; height: 24px; position: absolute; right: 10px; bottom: 0; z-index: 2; }
           .ban2 .lis span { display: block; float: left; opacity: 0.6; margin: 10px 3px; width: 19px; height: 19px; font-size: 14px; background: #696969; color: #fff; text-align: center; line-height: 19px; cursor: pointer; }
           .ban2 .lis span.on { opacity: 1; background: #ec4828; }
           .ban2 ul { position: absolute; left: 0; top: 0; }
           .ban2 ul li,  .ban2 ul li img { width: 300px; height: 175px; }
           .ban2 ul li { position: relative; }
           .ban2 ul li .bt { width: 100%; height: 24px; line-height: 24px; background: rgba(0, 0, 0, 0.7); position: absolute; left: 0; bottom: 0; }
           .ban2 ul li .bt a { display: block;  padding: 0 10px; height: 24px; font-size: 12px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
           .num { height: 30px; overflow: hidden;  position: relative;  }
           .min_pic { padding: 10px 0 0 0px;   height: 30px; }
           .num ul { position: absolute; left: 0; top: 0; height: 30px !important; }
           .num ul li { width: 52px; height: 30px; margin: 0 10px 0 0; }
           .num ul li img { width: 50px; height: 28px; border: 1px solid transparent; }
           .num ul li.on img { border: 1px solid #007bff; }
    }
    .list{
        padding-bottom: 10px;
       ul{
        li{
            font-size: 12px;
           .item{
            display: flex;
            align-items: center;
            overflow: hidden;
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
            padding: 10px 0;
            .tab{
                height: 36px;
                line-height: 36px;
                overflow: hidden;
                background: rgba(0, 123, 255,0.1);
                border-radius: 5px;
                color: #000;
                display: block;
                padding: 0 10px;

            }
            .infor{
                flex: 1;
                overflow: hidden;
                padding-left: 8px;
                line-height: 18px;
                display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;
                .tex{
                    color: #222;
                    &:hover{
                        color: #007bff;
                    }
                }
            }
           } 
           .text{
            overflow: hidden;
            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;
            color: #444;
            line-height: 22px;
            padding: 5px 0 0 0;
           }
        }
       } 
    }
    .list1{
       padding-bottom: 10px;
       ul{
        li{
            height: 90px;
            width: 100%;
            position: relative;
            overflow: hidden;
            border-radius: 5px;
            margin-top: 10px;
            .img{
                width: 100%;
                height: 100%;
                display: block;
            }
            .motai{
                position: absolute;
                top: 0px;
                left: 0px;
                display: flex;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.6);
                color: #fff;
                justify-content: center;
                align-items: center;
                text-align: center;
                &:hover{
                    text-decoration: underline;
                }
                .text{
                    color: #fff;
                    padding: 0 10px;
                    word-wrap: break-word;
                    display: block;
                    .bt{
                        font-weight: bold;
                        line-height: 20px;
                        height: 20px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                        display: block;
                    }
                    .p{
                        padding-top: 5px;
                        display: -webkit-box;
                         -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;   
                         word-break: break-all;  
                         overflow: hidden;
                         line-height: 20px;
                         font-size: 12px;

                    }

                }
            }
        }
       }
    }
    .list2{
      padding-bottom: 10px;
      .text{
        .bt{
            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;  
            overflow: hidden;
            color: #000;
            line-height: 24px;
            padding-bottom: 5px;
        }
        .tex{
            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;  
            overflow: hidden;
            line-height: 24px;
            font-size: 12px;
            color: #444;
        }
      }
      .vots{
        padding-top: 5px;
        li{
            height: 25px;
            display: flex;
            align-items: center;
            margin: 0px 0 10px 0;
            .infor{
                flex: 1;
                overflow: hidden;
                margin-right: 10px;
                .line{
                    border:1px solid rgba(0, 0, 0, 0.21);
                    height: 23px;
                    line-height: 23px;
                    border-radius:3px;
                    padding: 0 5px;
                   color: rgba(0, 0, 0, 0.6);
                   font-size: 12px;
                   position: relative;
                   overflow: hidden;
                }
            }
            .btn{
                width: 50px;
                height: 25px;
                background: #007bff;
                color: #fff;
                text-align: center;
                line-height: 25px;
                border-radius: 5px;
                cursor: pointer;
            }
        }
      }
      .time-tishi{
        color: rgba(0, 0, 0, 0.5);
        text-align: center;
        font-size: 12px;
        line-height: 20px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        padding-bottom: 5px;
      }
      .moreitem{
        margin: 10px 0;
        padding-left: 25px;
        position: relative;
        font-size: 12px;
        .tile{
            height: 100%;
            width: 25px;
            background: rgba(0, 0, 0, 0.24);
            position: absolute;
            left: 0;
            top: 0;
            min-height: 60px;
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 5px;
            color: #fff;
            line-height: 20px;
        }
        .infor{
            padding-left: 10px;
            .item{
                height: 30px;
                line-height: 30px;
                display: flex;
                overflow: hidden;
                .bt{
                    flex: 1;
                    overflow: hidden;
                    font-weight: bold;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    &:hover{
                        color: #007bff;
                    }
                }
                span{
                    color: #828282;
                    transform: scale(0.8);
                }
            }
        }
      }
    }
    .list3{
        ul{
            padding-top: 10px;
            width: 105%;
            li{
                float: left;
                width: 145px;
                margin: 0 10px 10px 0;
                .box{
                    width: 100%;
                    display: block;
                    &:hover{
                        .name{
                            color: #007bff;
                        }
                    }
                    .img{
                        width: 100%;
                        height: 60px;
                        border-radius: 3px;
                        overflow: hidden;
                        position: relative;
                        .motai{
                            width: 100%;
                            height: 100%;
                            background: rgba(0, 0, 0, 0.5);
                            position: absolute;
                            top: 0;
                            left: 0;
                            i{
                                display: block;
                                width: 43px;
                                height: 43px;
                                background: url("../images/video2.png") no-repeat center;
                                position: absolute;
                                top: 50%;
                                left: 50%;
                                transform: translate(-50%,-50%);
                            }
                        }
                    }
                    .name{
                        padding-top: 5px;
                        font-size: 12px;
                        line-height: 18px;
                        overflow: hidden;
                        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     
                       height: 36px;
                    }
                }
                &.big{
                    width: 300px;
                    .box{
                      .img{
                        height: 140px;
                      }
                      .name{
                        font-size: 14px;
                        -webkit-line-clamp: 1;
                        height: 20px;
                        line-height: 20px;
                        font-weight: bold;
                      }
                    }
                }
            }
        }
    }
    .list4{
        .switchlab{
            padding-bottom: 5px;
        }
        ul{
            width: 105%;
            padding-top: 5px;
            li{
                float: left;
                width: 145px;
                margin: 0 10px 10px 0;
                font-size: 12px;
                .box{
                    display: block;
                    width: 100%;
                    .img{
                        width: 100%;
                        height: 105px;
                        border-radius: 5px;
                        overflow: hidden;
                    }
                    .name{
                        display: flex;
                        overflow: hidden;
                        align-items: center;
                        justify-content: center;
                        height: 38px;
                        padding-top: 5px;
                        span{
                            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     
                        }

                    }
                }

            }
        }
    }
    .list5{
        .lunbox{
            padding-top: 10px;
            height: 200px;
            overflow: hidden;
            position: relative;
            &:hover{
                .next,.prev{
                    display: block;
                } 
            }
            .next,.prev{
                background: rgba(0, 0, 0, 0.7);
                width: 30px;
                height: 60px;
                cursor: pointer;
                border-radius: 5px;
                transform: translate(0%, 0%);
                top: 40px;
                display: none;
                left: 0;
                &:hover{
                   background: rgba(0, 123, 255,0.5);
                }
                i{
                   position: absolute;
                   top: 0%;
                   right: 0;
                   bottom: 0;
                   margin: auto;
                   left: 0;
                }
           
               }
               .prev{
                   i{
                       right: -5px;
                   }
               }
               .next{
                right: 0;
                left: inherit;
                  i{
                   right: 5px;
                  }
               }
            .bd{
                position: relative;
                ul{
                    li{
                        float: left;
                        width: 300px;
                        .img{
                            width: 100%;
                            height: 115px;
                            border-radius: 5px;
                            overflow: hidden;
                            display: block;
                            box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.23);
                        }
                        .text{
                            padding-top: 5px;
                            .bt{
                                line-height: 20px;
                                height: 20px;
                                text-align: center;
                                display: block;
                                overflow: hidden;
                                white-space: nowrap;
                                font-weight: bold;

                            }
                            .tex{
                                display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-all;
                                font-size: 12px;
                                line-height: 20px;
                                color: #444;
                                height: 60px;
                                overflow: hidden;
                            }  
                        }
                    }
                }
            }
            .hd{
                position: absolute;
                width: 100%;
                text-align: center;
                height: 7px;
                top: 105px;
                li{
                    width: 7px;
                    height: 7px;
                    border-radius: 50%;
                    display: inline-block;
                    vertical-align: middle;
                    margin: -2px 4px 0 ;
                    background: #fff;
                    overflow: hidden;
                    text-indent: 100em;
                }
                .on{
                    background: #007bff;
                }
            }
        }
    }
  }  
  .indexADD1-2{
    width: 880px;
    padding-left: 20px;
    .indexADD1-2-1{
        width: 560px;
        padding-right: 20px;
        .padt10{
            padding-top: 10px;
        }
        .h1-h2{
            text-align: center;
            padding-top: 10px;
            .h1{
                font-size: 16px;  
                line-height: 36px;
                height: 36px;
                overflow: hidden;
                font-weight: bold;
                white-space: nowrap;
                text-overflow: ellipsis;
                color: #007bff;
                a{
                    color: #007bff;
                    &:hover{
                        text-decoration: underline;
                    }
                }

            }
            .h2{
              height: 30px;
              line-height: 30px;
              overflow: hidden;
              a{
                padding: 0 1px;
              }
            }
        }
        .list{
            .lis{
                display: flex;
                overflow: hidden;
                height: 33px;
                line-height: 33px;
                align-items: center;
                .img{
                   width: 20px; 
                   height: 20px;
                   display: block;
                   border-radius: 3px;
                   overflow: hidden;
                   margin-right: 5px;
                }
                .flex{
                    flex: 1;
                    overflow: hidden;
                    margin-right: 10px;
                    display: flex;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    height: 100%;
                    align-items: center;
                    .tex{
                        max-width: 500px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                  
                }
                .cor1{
                    color: #007bff;
                }
                .cor2{
                    color: #e67c00;
                }
                .icobf{
                   width: 13px; 
                   height: 13px;
                   display: inline-block;
                   vertical-align: middle;
                   background: #007bff;
                   color: #fff;
                   border-radius: 50%;
                   position: relative;
                   &::before{
                    content: '';
                    border-top: 3px solid transparent;
                    border-bottom: 3px solid transparent;
                    border-left: 5px solid #fff;
                    position: absolute;
                    width: 0;
                    height: 0px;
                   display: block;
                   top: 50%;
                   left: 50%;
                   transform: translate(-35%,-50%);
                   }
                
                }
                .time{
                    font-size: 12px;
                    opacity: 0.7;
                }
                  


            }
        }
        .lunbox{
             .next ,  .prev {
                position: relative;
              display: block;
              transform:none;
                top: 0;
                right: 0;
                left: 0;

                i{
                    border-color: rgba(0, 0, 0, 0.2);
                }
            }
          
            .hd{
                padding-top: 5px;
                height: 30px;
                position: relative;
              display: flex;
              justify-content: center;
              align-items: center;
              ul{
             display: block;
             height: 7px;
             padding: 0 10px;
                li{
                    display: inline-block;
                    vertical-align: middle;
                    width: 7px;
                    height: 7px;
                    background: rgba(0, 0, 0, 0.5);
                    border-radius: 50%;
                    overflow: hidden;
                    text-indent: 100em;
                    margin: 0 8px;
                    margin-top: -8px;
                }
                .on{
                    background: #007bff;
                }
              }
            }
        }
        .morelis{
            height: 30px;
            line-height: 30px;
            text-align: center;
            padding-top: 5px;
        }
        .list2{
           width: 105%;
           padding-top: 5px;
           .lis{
            display: block;
            overflow: hidden;
            float: left;
            width: 230px;
            margin: 10px 0px 0px 30px;
            .img{
                width: 100%;
                height: 130px;
                position: relative;
                border-radius: 5px;
                overflow: hidden;
                .time{
                    position: absolute;
                    top: 0px;
                    left: 0;
                    height: 25px;
                    line-height: 25px;
                    background: #007bff;
                    color: #fff;
                    padding: 0 5px;
                    border-radius: 3px;

                }
            }
            .name{
                display: block;
                line-height: 19px;
                display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;    
                overflow: hidden;
                padding-top: 5px;
            }
           }
           .big{
            width: 490px;
            .img{
                height: 270px;
            }
           }
        }
    }
    .indexADD1-2-2{
        width: 300px;
        .list1{
            width: 110%;
          .lis{
            display: block;
            float: left;
            width: 133px;
            height: 81px;
            border-radius: 3px;
            overflow: hidden;
            position: relative;
            box-shadow: 0px 2px 8px 0px  rgba(0, 0, 0, 0.27);
            margin: 15px 30px 0 0;
            .img{
                width: 100%;
                height: 100%;
                display: block;
                
            }
            .motai{
                position: absolute;
                top: 0px;
                left: 0;
                background: rgba(0, 0, 0, 0.5);
                color: #fff;
                width: 100%;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                line-height: 20px;
                text-decoration: underline;
                &:hover{
                    color: #007bff;
                }
                i{
                    position: absolute;
                    height: 20px;
                    right: -5px;
                    top: -2px;
                    line-height: 20px;
                    padding: 0 10px;
                    transform: scale(0.8);
                    border-radius: 5px;
                    color: #fff;
                }
                p{
                    padding: 0 5px;
                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;
                    word-break: break-all;
                    overflow: hidden;
                    max-height: 40px;
                    text-align: center;


                }
                .cor1{
                    background: #ff0000;
                }
                .cor2{
                    background: #70b603;
                }

            }

          }  
        }
        .list2{
            .item{
                padding-top: 10px;
                .bt_{
                    height: 30px;
                    .user_ {  display: flex; max-width: 200px; overflow: hidden; float: left; align-items: center; }
                    .user_ .img_ {
                         width: 30px; height: 30px; display: block; border-radius: 50%; overflow: hidden; 
                         img{
                            width: 100%;
                            height: 100%;
                            display: block;
        
                         }
                        }
                    .user_ .infor { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; overflow: hidden; padding-left: 10px; }
                    .user_ .infor .name {font-size: 12px; color: #222; height: 18px; line-height: 18px; display: block; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis;   }
                    .user_ .infor a.name:hover{color: #0066ff;}
                    .user_ .infor .time { color: #969696; font-size: 12px; transform: scale(0.8) translateX(-5px); }
                    .layui-nav{
                        float: right;
                        height: 20px;
                        padding: 0;
                        background: none;
                        margin-top: 10px;
                        &:hover{
                            .ico{background-position: -393px 0;}
                        }
                        .ico{
                            transform: scale(0.8);
                            cursor: pointer;
                            height:10px;width:12px;
                            background-position: -416px 0;
                            display: block;
                        }
                        .layui-nav-child{
                            left: initial;
                            right: 0px;
                            top: 10px;
                            text-align: center;
                            font-size: 12px;
                            a{
                                line-height: 25px;
                                font-size: 12px;
                            }
                            .on{
                                background: #e5f2ff;
                                color: #007bff;
                            }
                        }
                    }
        
        
                  }
                  .text_p{
                    line-height: 20px;
                    font-size: 12px;
                    padding: 5px 0;
                    img{
                      display: block;  
                      max-width: 100%;
                      margin:3px  auto;
                    }
                    p{
                        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                        line-height: 20px;
                        overflow: hidden;
                    }
                    .bttex{
                        display: block;
                        font-weight: bold;
                    }
                  }
            }
        }
        .list3{
            padding-top: 10px;
            ul{
                padding-top: 10px;
                li{
                    display: flex;
                    align-items: center;
                    margin-bottom: 20px;
                    .img{
                        width: 103px;
                        height: 44px;
                        display: block;
                        border-radius: 5px;
                        overflow: hidden;
                        position: relative;
                        i{
                            position: absolute;
                            top: 0;
                            left: 0;
                            height: 20px;
                            font-size: 12px;
                            background: #007bff;
                            color: #fff;
                            padding: 0 5px;
                            border-radius: 0 0 5px 0;
                            line-height: 20px;
                            display: none;
                        }
                    }
                    .infor{
                        flex: 1;
                        padding-left: 10px;
                        overflow: hidden;
                        line-height: 22px;
                        .name{
                            overflow: hidden;
                            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     
                        }
                        .tex{
                            display: none;
                        }
                        .lab{
                            height: 22px;
                            line-height: 22px;
                            overflow: hidden;
                            width: 100%;
                            display: none;
                            .tab{
                                display: block;
                                overflow: hidden;
                                height: 22px;
                                padding: 0 8px;
                                background-color: #f2f2f2;
                                border-radius: 5px;
                                float: left;
                                margin-right: 10px;
                                font-size: 12px;
                                &:last-child{
                                    margin: 0;
                                }

                            }

                        }

                    }
                    &.on{
                        height: 140px;
                        align-items: flex-start;
                        .img{
                            height: 140px;
                            i{
                                display: block;
                            }
                        }
                        .infor{
                            line-height: 25px;
                            .tex{
                                display: block;
                                overflow: hidden;
                                padding-top: 5px;
                                display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     
                            }
                            .lab{
                                display: block;
                                padding-top: 10px;
                            }
                        }

                    }
                    
                }
            }
        }
        .list4{
            ul{
                padding-top: 10px;
                li{
                    display: flex;
                    align-items: center;
                    margin-bottom: 20px;
                    .img{
                        width: 103px;
                        height: 54px;
                        display: block;
                        border-radius: 5px;
                        overflow: hidden;
                        position: relative;
                        i{
                            position: absolute;
                            top: 0;
                            height: 18px;
                            font-size: 12px;
                            color: #fff;
                            padding: 0 3px;
                            border-radius: 0 0 5px 0;
                            line-height: 18px;
                        }
                        .i1{left:0;background: #d9001b;}
                        .i2{right:0;background: #70b603;  border-radius: 0 0  0 5px;}
                    }
                    .infor{
                        flex: 1;
                        overflow: hidden;
                        padding-left: 10px;
                        .name{
                            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                            line-height: 20px;
                            overflow: hidden;
                            height: 40px;
                            margin-top: -2px;

                        }
                        .tex{
                            font-size: 12px;
                            padding-top: 3px;
                            span{
                                position: relative;
                                display: block;
                                float: left;
                                padding-right: 5px;
                            }
                            .liglt{
                                transform: scale(0.9);
                                text-decoration: line-through;
                            }

                        }
                    }
                }
            }
        }
        .list5{
            ul{
                li{
                    display: flex;
                    overflow: hidden;
                    margin: 10px 0;
                    float: left;
                    width: 100%;
                    .img{
                        width: 57px;
                        height: 57px;
                        border:1px solid #b6b6b6;
                        border-radius: 2px;
                        position: relative;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        background: #fff;
                        img{
                            max-width: 80%;
                            max-height: 80%;
                            display: block;
                            margin: 0 auto;
                        }
                    }
                    .infor{
                        flex: 1;
                         overflow: hidden;
                         padding-left: 10px;
                         .name{
                            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                            line-height: 20px;
                            overflow: hidden;
                            margin-top: -2px;

                        }
                        .time{
                            line-height: 20px;
                            font-size: 12px;
                        }
                        .lab{
                            display: inline-block;
                            vertical-align: middle;
                            margin-top: 3px;
                            height: 20px;
                            line-height: 20px;
                            border-radius: 4px;
                            color: #fff;
                            background: #d9001b;
                            font-size: 12px;
                            padding: 0 5px;
                            transform: scale(0.8) translateX(-10%);


                        }
                        .cor{
                            background: #70b603;
                        }
                    }

                }
            }
        }
    }
    .indexADD1-2-3{
        padding-top: 10px;
        .list1{
            display: flex;
            padding-top: 15px;
            padding-bottom: 20px;
            .bt_h{
                width: 36px;
                height: 175px;
                color: #007bff;
                text-align: center;
                background: #e5f2ff;
                word-break: break-all;
                font-size: 12px;
                flex-wrap: wrap;
                display: flex;
                flex-flow: column;
                border-radius: 5px;
                overflow: hidden;
                .tab{
                    flex: 1;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    padding: 3px 3px;
                   border-radius: 5px;
                   cursor: pointer;

                }
                .on{
                    background: #007bff;
                    color: #fff;
                }
            }
            .flex1{
                flex: 1;
                overflow: hidden;
            }
            ul{
                li{
                    float: left;
                    width: 178px;
                    margin: 0 15px 0 20px;
                    &:last-child{
                        margin-right: 0px;
                    }
                    .img{
                        width: 100%;
                        display: block;
                        height: 122px;
                        border-radius: 5px;
                        overflow: hidden;
                    }
                    .name{
                        font-size: 12px;
                        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-all;  
                        line-height: 16px;
                        padding-top: 5px;

                    }
                } 
            }

        }
        .list2{
            width: 100%;
            position: relative;
            .lunbox{
                position: relative;
                width: 100%;
                height: 96px;
                margin-top: 15px;
                .bd{
                    height: 96px;
                    overflow: hidden;
                    li{
                        width: 160px;
                        height: 96px;
                        border-radius: 5px;
                        overflow: hidden;
                        float: left;
                        margin-right: 20px;
                        .img{
                            width: 100%;
                            height: 100%;
                            display: block;
                            position: relative;
                            .motai{
                                position: absolute;
                                top: 0;
                                left: 0;
                                background: rgba(0, 0, 0, 0.5);
                                width: 100%;
                                height: 100%;
                                color: #fff;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                font-size: 16px;
                            }

                        }


                    }
                }
            }
        }
    }
  }  
   
}
.indexADD2{
    padding-bottom: 20px; 
   .warp{
    padding-top: 20px;
       .imgbox{
        width: 280px;
        float: left;
        .imgbig{
            height: 350px;
            border-radius: 5px;
            overflow: hidden;
            display: block;

        }
        .imgli{
            overflow: hidden;
            .img{
                width:50px ;
                height: 58px;
                display: block;
                float: left;
                overflow: hidden;
                margin: 10px 7px 0 0;
                &:nth-child(5n){
                    margin-right: 0px;
                }

            }

        }


       }
       .texbox{
        width: 430px;
        float: left;
        margin: 0 20px;
        .name{
            font-size: 16px;
            line-height: 24px;
            font-weight: bold;
            overflow: hidden;
            max-height: 48px;
            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     
            span{
                font-size: 14px;
                u{
                    text-decoration: none;
                    opacity: 0.7;
                }
            }
        }
        .tabli{
            overflow: hidden;
            .tab{
                float: left;
                border-radius: 5px;
                display: block;
                height: 24px;
                line-height: 24px;
                padding: 0 5px;
                color: #fff;
                font-size: 12px;
                border:1px solid #007bff;
                margin: 5px 18px 3px 0;


            }
            .cor1{background: #d9001b;border-color: #d9001b;}
            .cor2{background: #007bff;border-color: #007bff;}
            .cor3{background: #1c5292;border-color: #1c5292;}
            .cor4{background: #4b31b0;border-color: #4b31b0;}
            .cor5{  color: #007bff;}
            .cor6{background: #0a0a64;border-color: #0a0a64;}
            .cor7{background: #0c0c0b;border-color: #0c0c0b;}
            .cor8{background: #57880a;border-color: #57880a;}

        }
        .list{
            .lis{
                display: flex;
                overflow: hidden;
                line-height: 30px;
                font-size: 15px;
                color: #000;
                padding: 5px 0;
                .cor1{color: #f59a23;}
                .cor2{color: #d9001b;}
                .cor3{color: #6735eb;}
                .bt{
                    width: 180px;
                }
                .p{
                    flex: 1;
                   overflow: hidden;
                 
                }
                .pf{
                    display: flex;
                    flex-wrap: wrap;
                    justify-items: center;
                    height: 100%;
                    p{
                        width: 100%;
                    }
                }
                .stare{
                    // background: url("../images/stare2.png") no-repeat top left;
                    position: relative;
                    width: 99px;
                    height: 16px;
                    margin-top: 7px;
                    i{
                        position: absolute;
                        width: 100%;
                        height: 100%;
                        top: 0;
                        left: 0;
                        background: url("../images/stare.png") no-repeat top left;
                        display: block;
                    }

                }
            }
        }
       }
       .listbox{
            float: right;
            width: 440px;
            .list{
                padding-top: 20px;
                li{
                    position: relative;
                    line-height: 20px;
                    padding: 10px 0;
                    min-height: 38px;
                    &:last-child{
                        padding-bottom: 0px;
                    }
                    &::before{
                        border-left: 1px solid rgba(0, 0, 0, 0.2);
                        position: absolute;
                        left: 45px;
                        top: 0px;
                        height: 100%;
                        content: '';
                       }
                   .flex{
                    display: flex;
                    align-items: center;
                   }
                    .ico { border: 1px solid rgba(0, 0, 0, 0.1); background: #fff; border-radius: 50%; width: 8px; height: 8px; position: absolute; right: -5px; top: 4px; }
                    .ico::before { content: ''; display: block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #007bff; width: 3px; height: 3px; }
                   .time{
                    width: 45px;
                    position: relative;
                   }
                    .p{
                     flex: 1;
                     padding-left: 10px;
                     a{
                        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                        overflow: hidden;

                     }
                   }
                   p{
                    padding-left: 55px;
                    font-size: 12px;
                    padding-top: 5px;
                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                    overflow: hidden;
                   }
                }
            }
            .list2{
                .bt{
                    height: 30px;
                    line-height: 30px;
                    font-weight: bold;
                    font-size: 15px;
                }
                .shop{
                    height: 30px;
                    line-height: 30px;
                    display: block;
                }
                .lis{
                    display: flex;
                    overflow: hidden;
                    align-items: center;
                    font-size: 12px;
                    padding: 7px 0;
                    .bt_{
                        height: 18px;
                        line-height: 18px;
                        border:1px solid rgba(0, 0, 0, 0.3);
                        border-radius: 3px;
                        display: block;
                        width: 70px;
                        text-align: center;
                        overflow: hidden;
                    }
                    .p{
                        flex: 1;
                        overflow: hidden;
                        height: 20px;
                        line-height: 20px;
                        padding-left: 5px;
                        a{
                            padding: 0 5px;
                        }

                    }

                }
                .lis2{
                    padding-top: 5px;
                    height: 130px;
                    overflow: hidden;
                    position: relative;
                    .prev,.next{
                        top: 35%;
                        display: none;
                    }
                    &:hover{
                        .prev,.next{
                            display: block;
                        }
                    }
                    ul{
                        li{
                            display: block;
                            float: left;
                            width: 145px;
                            margin-right: 10px;
                            .box{
                                width: 100%;
                                .img{
                                    height: 85px;
                                    width: 100%;
                                    border-radius: 5px;
                                    overflow: hidden;
                                    position: relative;
                                    .motai{
                                        width: 100%;
                                        height: 100%;
                                        top: 0px;
                                        left: 0;
                                        background: rgba(0, 0, 0, 0.5);
                                        position: absolute;
                                        color: #fff;
                                        display: flex;
                                        justify-content: center;
                                        align-items: center;
                                        overflow: hidden;
                                        &:hover{
                                            text-decoration: underline;
                                        }
                                        span{
                                            text-align: center;
                                            padding: 0 8px;
                                            font-size: 12px;
                                            line-height: 20px;
                                            max-height: 40px;
                                            overflow: hidden;

                                        }

                                    }
                                }
                                p{
                                    line-height: 20px;
                                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                                    overflow: hidden;
                                    padding-top: 5px;

                                }
                            }
                        }
                    }
                }
            }
            .list3{
                li{
                    height: 30px;
                    line-height: 30px;
                    display: flex;
                    overflow: hidden;
                    padding: 20px 0;
                    font-weight: bold;
                    a{
                        color: #222;
                    }
                    .bt{
                        width: 110px;
                        display: block;
                        overflow: hidden;
                        height: 30px;
                    }
                    .tab{
                        width: 110px;
                        text-align: center;
                        color: #fff;
                        height: 30px;
                        overflow: hidden;
                        border-radius: 5px;
                        padding: 0 3px;
                        font-weight: normal;

                    }
                    .cor1{background: #000080;}
                    .cor2{background: #4b7902;}
                    .cor3{background: #027db4;}
                    .cor4{background: #70b603;}
                    .cor5{background: #d9001b;}
                    .lang{
                        flex: 1;
                        overflow: hidden;
                        height: 30px;
                        overflow: hidden;
                        padding-left: 10px;
                    }
                    .price{
                        height: 30px;
                        overflow: hidden;
                        text-align: right;
                    }
                }

            }
       }
   } 
}
.indexADD3{
    padding-bottom: 10px;
    .lunbox{
        width: 100%;
        position: relative;
        height: 90px;
        overflow: hidden;
        margin: 5px 0;
        .bd{
            li{
                float: left;
                width: 222px;
                height: 90px;
                position: relative;
                overflow: hidden;
                margin-right: 22px;
                .img{
                    width: 100%;
                    height: 100%;
                    display: block;
                    position: relative;
                    color:#fff;
                    border-radius: 5px;
                    overflow: hidden;
                    &:hover{
                       span{
                        text-decoration: underline;
                       }
                    }
                    p{
                        position: absolute;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        background: rgba(0, 0, 0, 0.5);
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        overflow: hidden;
                        span{
                            padding: 0 30px;

                        }
                    }
                }
            }
        }
    }
}
.indexADD4{
    padding-bottom: 20px;
    .list{
       .libox{
        width: 65px;
        display: block;
        float: left;
        .img{
            height: 65px;
            width: 65px;
            border-radius: 5px;
            overflow: hidden;
        }
        p{
            height: 20px;
            line-height: 20px;
            overflow: hidden;
            font-size: 13px;
            text-align: center;
            width: 100%;
            padding-top: 5px;
        }

       }   
    }
    .warp{
        .Iaddtitle{
            .bt{
                // font-size: 15px;
                font-weight: normal;
            }
            .on{
                color: #007bff;
            }
        }
    }
    .lunbox{
        position: relative;
        padding-bottom: 7px;
        .hd{
            position: absolute;
            width: 100%;
            text-align: center;
            height: 7px;
            bottom: 0px;
            li{
                width: 7px;
                height: 7px;
                border-radius: 50%;
                display: inline-block;
                vertical-align: middle;
                margin: -2px 4px 0 ;
                border:1px solid rgba(0, 0, 0, 0.2);
                overflow: hidden;
                text-indent: 100em;
            }
            .on{
                background: #007bff;
                border-color: #007bff;
            }
        }
    }
    .indexADD4-1{
        width: 320px;
        .Iaddtitle{
            text-align: center;
            .bt{
                display: inline-block;
                vertical-align: middle;
                float: none;
            }
        }
       .list {
        padding-top: 5px;
        .libox{
            margin: 5px 0 0 28px;
         }
       }
    }
    .indexADD4-2{
        width: 525px;
        .lunbox{
            .bd{
                height: 285px;
                overflow: hidden;
                li{
                    .lis{
                        display: flex;
                        overflow: hidden;
                        height: 35px;
                        line-height: 35px;
                        align-items: center;
                        .img{
                           width: 20px; 
                           height: 20px;
                           display: block;
                           border-radius: 3px;
                           overflow: hidden;
                           margin-right: 5px;
                        }
                        .flex{
                            flex: 1;
                            overflow: hidden;
                            margin-right: 10px;
                            display: flex;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                            height: 100%;
                            align-items: center;
                            .tex{
                                max-width: 500px;
                                overflow: hidden;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                            }
                          
                        }
                        .cor1{
                            color: #007bff;
                        }
                        .cor{
                            color: #e67c00;
                        }
                        .icobf{
                           width: 13px; 
                           height: 13px;
                           display: inline-block;
                           vertical-align: middle;
                           background: #007bff;
                           color: #fff;
                           border-radius: 50%;
                           position: relative;
                           &::before{
                            content: '';
                            border-top: 3px solid transparent;
                            border-bottom: 3px solid transparent;
                            border-left: 5px solid #fff;
                            position: absolute;
                            width: 0;
                            height: 0px;
                           display: block;
                           top: 50%;
                           left: 50%;
                           transform: translate(-35%,-50%);
                           }
                        
                        }
                        .time{
                            font-size: 12px;
                            opacity: 0.7;
                        }
                          
        
        
                    }
                }
            }
        }
    }
    .indexADD4-3{
        width: 335px;
        .list{
            padding-top: 5px;
            .libox{
                margin: 5px 25px 0 0;
                &:nth-child(4n){
                    margin-right: 0px;
                }

            }

        }
        .lunbox{
            padding-top: 5px;
            .bd{
                height: 150px;
                overflow: hidden;
                li{
                    .img{
                        width: 335px;
                        height: 67px;
                        display: block;
                        position: relative;
                        border-radius: 5px;
                        overflow: hidden;
                        margin-bottom: 10px;
                        .motai{
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background:rgba(0, 0, 0, 0.5);
                            color: #fff;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            display: none;
                            p{
                                padding: 0 10px;
                            }
                        }
                        &:last-child{
                            margin-bottom: 5px;
                        }
                    }
                }
            }
        }
    }
}
.indexADD5{
    .warp{
        .Iaddtitle{
            padding-bottom: 5px;
            .bt{
                font-size: 15px;
            }
        }
    }
    .indexADD5-1{
        width: 335px;
        .Iaddtitle{
            padding-bottom: 5px;
        }
        .box{
            position: relative;
            border-radius: 5px;
            overflow: hidden;
            .img{
                width: 100%;
                height: 100%;
                display: block;
                border-radius: 5px;

            }
            .motai{
                position: absolute;
                top: 0;
                left: 0;
                background: rgba(0,0,0,0.5);
                color: #fff;
                display: flex;
                width: 100%;
                height: 100%;
                align-items: center;
                justify-content: center;
                text-align: center;
                .tex{
                    font-size: 24px;
                    line-height: 40px;
                }
                .theme{
                    font-size: 22px;
                    height: 36px;
                    line-height: 36px;
                    margin:10px 0;
                    span{
                        width: 50px;
                        text-align: center;
                        color: #007bff;
                        background: #fff;
                        display: inline-block;
                        vertical-align: middle;
                        border-radius: 5px;
                        margin: 0 10px;
                        
                    }
                }

            }

        }
        .box1{
            width: 100%;
            height: 200px;
            margin-bottom: 5px;
        }
        .list{
            li{
                width: 158px;
                height: 310px;
                float: left;
                margin-right: 15px;
                &:nth-child(2n){
                    margin-right: 0px;
                }
                .box{
                    width: 100%;
                    height: 100%;
                    display: block;
                    .motai{
                        .tex{
                            font-size: 12px;
                            line-height: 22px;
                        }
                        .num{
                            color: #70b603;
                            font-size: 32px;
                            font-weight: bold;
                            line-height: 50px;
                            padding: 50px 0;
                        }
                        .btn{
                            width: 75px;
                            height: 25px;
                            line-height: 25px;
                            text-align: center;
                            margin: 10px auto;
                            display: block;
                            color: #fff;
                            background: #007bff;
                            border-radius: 5px;
                            &:hover{
                                opacity: 0.9;
                            }
                        }

                    }

                }
                
            }
        }
        .list2{
            height: 70px;
            padding-top: 20px;
            li{
                float: left;
                width: 158px;
                height: 70px;
                margin-right: 15px;
                &:nth-child(2n){
                    margin-right: 0px;
                }
                .img{
                    width: 100%;
                    height: 100%;
                    display: block;
                    border-radius: 5px;
                    overflow: hidden;
                }

            }


        }
    }
    .indexADD5-2{
        overflow: hidden;
        width: 864px;
        .list{
            li{
                width: 270px;
                display: block;
                float: left;
                margin: 0px 0 10px 18px;
                .img{
                    height: 120px;
                    width: 100%;
                    border-radius: 5px;
                    overflow: hidden;
                    display: block;
                    position: relative;
                    .tab{
                        position: absolute;
                        top: 0px;
                        border-radius: 5px;
                        height: 23px;
                        line-height: 23px;
                        color: #fff;
                        padding: 0 3px;
                        min-width: 40px;
                        text-align: center;
                        width: auto;
                        font-size: 12px;
                    }
                    .lab1{background: #d9001b; left: 0;}
                    .lab2{background: #70b603; right: 0;}
                }
                .name{
                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; 
                    overflow: hidden;  
                    line-height: 22px;
                    height: 44px;
                    padding-top: 7px;

                }
                .number{
                    height: 20px;
                    line-height: 20px;
                    overflow: hidden;
                    color: #f9a01b;
                    padding-top: 7px;
                    .through{
                        color: #7c7c7c;
                        font-size: 12px;
                        text-decoration: line-through;
                        padding-left: 10px;
                    }
                }

            }
        }
        
    }
}
.indexADD6{
    padding-bottom: 10px;
   .Iaddtitle.small{
    display: flex;
    width: 100%;
    .switchlab{
        flex: 1;
        overflow: hidden;
    }
    .more{
        font-size: 12px;
    }
      .bt{
        font-size: 15px;
        font-weight: normal;
      }
    }
    .indexADD6-1{
        width: 290px;
        .list{
            padding-bottom: 5px;
            .libox{
             width: 55px;
             display: block;
             float: left;
             margin: 10px 23px 0 0;
             &:nth-child(4n){
               margin-right: 0px;
             }
             .img{
                 height: 55px;
                 width: 55px;
                 border-radius: 5px;
                 overflow: hidden;
             }
             p{
                 height: 18px;
                 line-height: 18px;
                 overflow: hidden;
                 font-size: 12px;
                 text-align: center;
                 width: 100%;
                 padding-top: 3px;
             }
     
            }   
         }
         .list2{
            .tab{
                float: left;
                height: 30px;
                line-height: 30px;
                padding: 0 5px;
                border-radius: 5px;
                color: #fff;
                background: #007bff;
                margin: 10px 10px 0 0;
                &.big{
                    width: 100%;
                    padding: 0;
                    margin-right: 0px;
                    text-align: center;
                }
            }
            .cor1{background: #70b603;}
            .cor2{background: #f59a23;}
            .cor3{background: #0066ff;}
            .cor4{background: #a30014;}
            .cor5{background: #8400ff;}
            .cor6{background: #333333;}
            .cor7{background: #027db4;}
            .cor8{background: #4b7902;}
            .cor9{background: #7b4d12;}
         }
    }
    .indexADD6-2{
        width: 524px;
        padding-left: 26px;
        .Iaddtitle{
            .on{
                color: #007bff;
            }
        }
        .list{
            .lis{
                display: flex;
                overflow: hidden;
                height: 35px;
                line-height: 35px;
                align-items: center;
                .img{
                   width: 20px; 
                   height: 20px;
                   display: block;
                   border-radius: 3px;
                   overflow: hidden;
                   margin-right: 5px;
                }
                .flex{
                    flex: 1;
                    overflow: hidden;
                    margin-right: 10px;
                    display: flex;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    height: 100%;
                    align-items: center;
                    .tex{
                        max-width: 500px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }
                  
                }
                .cor1{
                    color: #007bff;
                }
                .cor{
                    color: #e67c00;
                }
                .icobf{
                   width: 13px; 
                   height: 13px;
                   display: inline-block;
                   vertical-align: middle;
                   background: #007bff;
                   color: #fff;
                   border-radius: 50%;
                   position: relative;
                   &::before{
                    content: '';
                    border-top: 3px solid transparent;
                    border-bottom: 3px solid transparent;
                    border-left: 5px solid #fff;
                    position: absolute;
                    width: 0;
                    height: 0px;
                   display: block;
                   top: 50%;
                   left: 50%;
                   transform: translate(-35%,-50%);
                   }
                
                }
                .time{
                    font-size: 12px;
                    opacity: 0.7;
                }
                  


            }
        }
    }
    .indexADD6-3{
        width: 335px;
        .lunbox{
            height: 100px;
            position: relative;
            overflow: hidden;
            margin: 10px 0;
            border-radius: 5px;
            .bd{
                li{
                    width: 335px;
                    height: 100px;
                    overflow: hidden;
                    border-radius: 5px;
                    .img{
                        width: 100%;
                        height: 100%;
                        overflow: hidden;
                        display: block;
                        position: relative;
                        .motai{
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background: rgba(0, 0, 0, 0.5);
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            color: #fff;
                            line-height: 25px;
                            text-align: center;
                            overflow: hidden;
                            &:hover{
                                text-decoration:underline;
                            }
                            p{
                                padding: 0 10px;
                            }
                        }
                    }
                }
            }
            .hd{
                position: absolute;
                left: 50%;
                bottom: 10px;
                height: 7px;
                text-align: center;
                transform: translateX(-50%);
                ul{
                    height: 7px;
                }
                li{
                    display: inline-block;
                    vertical-align: middle;
                    height: 7px;
                    width: 7px;
                    background: #fff;
                    border-radius: 50%;
                    margin: -7px 5px 0 5px;
                    text-indent: 100em;
                    overflow: hidden;

                }
                .on{
                    background: #007bff;
                }
            }
        }
        .imgbox{
            width: 100%;
            height: 265px;
            background: rgba(0, 0, 0, 0.03);
            position: relative;
            border-radius: 5px;
            margin-top: 5px;
            .img{
                position: absolute;
                border-radius: 30%;
                overflow: hidden;
                display: block;
                &:hover{
                    box-shadow: 0px 2px 5px rgba(0,0,0,0.3);
                    z-index: 20;
                }
            }
            .img1 {z-index: 20;width: 80px;height: 80px;top: 43px;left: 144px;}
            .img2 {z-index: 19;width: 80px;height: 80px;top: 90px;left: 89px;}
            .img3 {z-index: 18;width: 70px;height: 70px;top: 120px;left: 20px;}
            .img4 {z-index: 17;width: 70px;height: 70px;top: 127px;left: 155px;}
            .img5 {z-index: 16;width: 68px;height: 68px;top: 41px;left: 61px;}
            .img6 {z-index: 15;width: 68px;height: 68px;top: 81px;left: 217px;}
            .img7 {z-index: 14;width: 60px;height: 60px;top: 154px;left: 220px;}
            .img8 {z-index: 13;width: 60px;height: 60px;top: 20px;left: 210px;}
            .img9 { z-index: 12; width: 55px; height: 55px; top: 30px; left: 260px; }
            .img10 {z-index: 11;width: 55px;height: 55px;top: 10px;left: 16px;}
            .img11 {z-index: 10;width: 50px;height: 50px;top: 183px;left: 69px;}
            .img12 { z-index: 9; width: 40px; height: 40px; top: 220px; left: 14px; }
            .img13 {z-index: 8;width: 40px;height: 40px;top: 217px;left: 280px;}
            .img14 {z-index: 7;width: 30px;height: 30px;top: 159px;left: 290px;}
            .img15 { z-index: 6; width: 30px; height: 30px; top: 100px; left: 290px; }
            .img16 { z-index: 5; width: 30px; height: 30px; top: 210px; left: 186px; }
            .img17 {z-index: 4;width: 30px;height: 30px;top: 190px;left: 125px;}
            .img18 { z-index: 3; width: 20px; height: 20px; top: 200px; left: 40px; }
            .img19 {z-index: 2;width: 20px;height: 20px;top: 19px;left: 140px;}
            .img20 { z-index: 1; width: 20px; height: 20px; top: 8px; left: 100px; }

        }
    }
}
.indexADD7{
    .indexADD7-1{
       width: 290px;
       .list1{
        ul{
            li{
                .bt{
                    display: flex;
                    overflow: hidden;
                    height: 20px;
                    line-height: 20px;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    padding: 10px 0;
                    font-size: 12px;
                    .img{
                        width: auto;
                        max-height: 20px;
                        display: block;
                        overflow: hidden;
                        img{
                            height: 100%;
                        }
                    }
                    p{
                        flex: 1;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                        padding-left: 5px;
                        .a{
                            color: #007bff;
                        }
                    }
                }
                .vsbox{
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    .flex{
                        flex: 1;
                        overflow: hidden;
                        display: flex;
                        text-align: center;
                        justify-content: center;
                        align-items: center;
                        height: 30px;
                        line-height: 30px;
                        .img{
                            height: 30px;
                            width: 30px;
                            img{
                                width: auto;
                                height: auto;
                                position: absolute;
                                top: 50%;
                                left: 50%;
                                transform: translate(-50%,-50%);
                                max-height:90%;
                            }
                        }
                        .vs{
                            padding: 0 10px;
                            letter-spacing: 5px;
                            text-align: center;
                            display: flex;
                            justify-content: center;
                            width: 70px;
                        }

                    }
                    .btn{
                        width: 80px;
                        a{
                            margin: 0 5px;
                        }
                        .cor{
                            color: #007bff;
                        }
                    }
                }
            }
        }
       }
       .lunbox{
        padding: 10px 0;
        overflow: hidden;
        position: relative;
        border-radius: 5px;
        &:hover{
            .next,.prev{
                display: block;
            } 
        }
        .next,.prev{
            background: rgba(0, 0, 0, 0.7);
            width: 30px;
            height: 60px;
            cursor: pointer;
            border-radius: 5px;
            transform: translate(0%, 0%);
            top: 60px;
            display: none;
            left: 0;
            &:hover{
               background: rgba(0, 123, 255,0.5);
            }
            i{
               position: absolute;
               top: 0%;
               right: 0;
               bottom: 0;
               margin: auto;
               left: 0;
               opacity: 1;
               border-color: #fff;
            }
       
           }
           .prev{
               i{
                   right: -5px;
               }
           }
           .next{
            right: 0;
            left: inherit;
              i{
               right: 5px;
              }
           }
        .bd{
            position: relative;
            ul{
                li{
                    float: left;
                    width: 290px;
                    .img{
                        width: 100%;
                        height: 166px;
                        border-radius: 5px;
                        overflow: hidden;
                        display: block;
                        box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.23);
                    }
                    .text{
                        padding-top: 5px;
                        .bt{
                            line-height: 20px;
                            height: 40px;
                            overflow: hidden;
                            font-weight: bold;
                            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;  
                        }
                        .tex{
                            padding-top: 2px;
                            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;
                            font-size: 12px;
                            line-height: 20px;
                            color: #444;
                            height: 40px;
                            overflow: hidden;
                        }  
                    }
                }
            }
        }
        .hd{
            position: absolute;
            width: 100%;
            text-align: center;
            height: 7px;
            top: 155px;
            li{
                width: 7px;
                height: 7px;
                border-radius: 50%;
                display: inline-block;
                vertical-align: middle;
                margin: -2px 4px 0 ;
                background: #fff;
                overflow: hidden;
                text-indent: 100em;
            }
            .on{
                background: #007bff;
            }
        }
    }
    }
    .indexADD7-2{
        width: 530px;
        padding-left: 20px;
        .lunbox{
            position: relative;
            overflow: hidden;
            .bd{
                li{
                    padding-top: 5px;
                    .lis{
                        height: 30px;
                        line-height: 30px;
                        overflow: hidden;
                        display: flex;
                        padding: 2px 0;
                        .img{
                            width: 155px;
                            height: 83px;
                            display: none;
                            border-radius: 5px;
                            overflow: hidden;
                        }
                        .infor{
                            flex: 1;
                            overflow: hidden;
                            .name{
                                height: 30px;
                                line-height: 30px;
                                overflow: hidden;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                                display: block;
                                width: 100%;
                                &::before{
                                    content: '';
                                    width: 2px;
                                    height: 2px;
                                    display: inline-block;
                                    vertical-align: middle;
                                    background: #333;
                                    opacity: 0.5;
                                    margin: -2px 8px 0 0;
                                }
                            }

                        }
                        .time{
                            font-size: 12px;
                            opacity: 0.7;
                        }
                        &.on{
                           height: 83px;
                           padding: 5px 0 10px;
                           .img{
                            display: block;
                           }
                           .infor{
                               padding-left: 15px;
                               .name{
                                font-weight: bold;
                                height: auto;
                                white-space: normal;
                                height: 44px;
                                line-height: 20px;
                                display: -webkit-box; -webkit-line-clamp: 2; 
                                -webkit-box-orient: vertical; word-break: break-all;   
                                &::before{
                                    display: none;
                                }  

                               }
                               .tex{
                                padding-top: 5px;
                                font-size: 12px;
                                line-height: 18px;
                                display: -webkit-box; -webkit-line-clamp: 2; 
                                -webkit-box-orient: vertical; word-break: break-all;     

                               }
                           }
                           .time{
                            display: none;
                           }
                        }

                    }
                }
            }
        .hd {  width: 100%; text-align: center; height:15px; 
            margin-top: 10px;
           ul{
            height: 12px;
           }
           .on{
            background: #007bff;
            border-color: #007bff;
           }
        }
        .hd li { width: 10px; height: 10px; border-radius: 50%; display: inline-block; vertical-align: middle; margin: -7px 6px 0; border: 1px solid rgba(0, 0, 0, 0.2); overflow: hidden; text-indent: 100em; }
        }
    }
    .indexADD7-3{
       width: 335px;
       .list{
        overflow: hidden;
        padding-top: 10px;
        .imgbox{
            float: left;
            width: 160px;
            display: block;
            margin:0px 15px 8px 0;
            &:nth-child(2n){
               margin-right: 0px;
            }
            .img{
                width: 100%;
                height: 80px;
                border-radius: 5px;
                overflow: hidden;
            }
            .name{
                line-height: 20px;
                display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;  
                overflow: hidden;
                padding-top: 5px;
                height: 40px;

            }

        }
        .tex{
            float: left;
            width: 100%;
            line-height: 30px;
            height: 30px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            display: block;
        }

       }
       .list3{
        padding-bottom: 10px;
          .box{
             float: left;
             width: 100px;
             height: 52px;
             border-radius: 5px;
             overflow: hidden;
             color: #fff;
             display: block;
             margin: 10px 17px 0 0;
             line-height: 52px;
             font-size: 12px;
             text-align: center;
             img{
                display: inline-block;
                vertical-align: middle;
                margin: -2px 5px 0 0;
                max-width: 25px;
             }
             &:nth-child(3n){
                margin-right: 0px;
             }


          }
          .box1{background: #333333;}
          .box2{background: #d9001b;}
          .box3{background: #e67c00;}
       }
       .list2{
        .tab{
            float: left;
            height: 30px;
            line-height: 30px;
            padding: 0 5px;
            border-radius: 5px;
            color: #fff;
            background: #007bff;
            margin: 10px 10px 0 0;
            text-align: center;
            min-width: 90px;
            &.big{
                width: 100%;
                padding: 0;
                margin-right: 0px;
                text-align: center;
            }
        }
        .cor1{background: #70b603;}
        .cor2{background: #f59a23;}
        .cor3{background: #0066ff;}
        .cor4{background: #a30014;}
        .cor5{background: #8400ff;}
        .cor6{background: #333333;}
        .cor7{background: #027db4;}
        .cor8{background: #4b7902;}
        .cor9{background: #7b4d12;}
     }
    }
    .lunbox{
        width: 100%;
        position: relative;
        .next i, .prev i{
            border-color: #333;
            opacity: 0.6;
        }
    }
    .indexADD7-4{
        width: 100%;
        padding-bottom: 10px;
        .lunbox{
            .bd{
                padding-top: 10px;
                li{
                    width: 92px;
                    height: 91px;
                    border-radius: 5px;
                    border: solid 1px rgba(0, 0, 0, 0.1);
                    margin-right: 16px;
                    float: left;

                    .box{
                        width: 100%;
                        height: 100%;
                        text-align: center;
                        display: block;
                        font-size: 12px;
                        .img{
                           height: 50px; 
                           width: 80px;
                           margin: 5px auto;
                           position: relative;
                           display: block;
                           background: none;
                           img{
                            position: absolute;
                            top: 50%;
                            left: 50%;
                            transform: translate(-50%,-50%);
                            width: auto;
                            height: auto;
                            max-height: 90%;
                            max-width: 90%;

                           }
                        }
                        .name{
                            height: 20px;
                            line-height: 20px;
                            overflow: hidden;

                        }
                    }
                }
            }
        }
    }
    .indexADD7-5{
        padding-bottom: 10px;
        .next{right: 0;}
        .prev{left: 0;}
        .next, .prev{
            display: none;
            background: rgba(0, 0, 0, 0.5);
            width: 30px;
            height: 83px;
            top: 10px;
            transform:translate(0%, 0%);
           i{
            border-color: #fff;
            opacity: 1;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
           }
        }
        .lunbox{
            width: 1200px;
            height: 123px;
            overflow: hidden;
            &:hover{
                .next, .prev{
                    display: block;
                }
            }
            .bd{
                padding-top: 10px;
                li{
                   width: 160px; 
                   text-align: center;
                   margin-right: 13px;
                   .img{
                    height: 83px;
                    display: block;
                    width: 100%;
                    border-radius: 5px;
                    overflow: hidden;
                    .lab{
                        position: absolute;
                        top: 0;
                        left: 0;
                        height: 20px;
                        line-height: 20px;
                        font-size: 12px;
                        color: #fff;
                        padding: 0 5px;
                        border-radius: 5px 0 5px 0;

                    }
                    .cor1{background: #0066ff;}
                    .cor2{background: #a30014;}
                    .cor3{background: #b8741a;}
                    .cor4{background: #027db4;}
                    .cor5{background: #333333;}
                    .cor6{background: #0000ff;}
                    .cor7{background: #6300bf;}
                    .cor8{background: #4b7902;}
                    .cor9{background: #7b4d12;}
                   }
                   .name{
                    width: 100%;
                    height: 30px;
                    line-height: 30px;
                    overflow: hidden;
                    display: block;
                   }
                }
            }
        }
    }
}
.indexADD8{
    padding-bottom: 10px;
    .indexADD8-1{
        width: 285px;
        .list{
            padding-top: 5px;
            li{
                .name{
                    display: block;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    height: 26px;
                    line-height: 26px;
                    font-size: 12px;
                }
                .img,.tex{
                    display: none;
                }
                &.on{
                   .name{
                    font-size: 14px;
                   }
                   .img{
                    width: 100%;
                    display: block;
                    height: 110px;
                    overflow: hidden;
                    border-radius: 5px;
                }
                .tex{
                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;   
                    font-size: 14px;
                    line-height: 20px;
                    padding: 3px;
                    margin-bottom: 3px;
                }
                }
            }
        }
        .list2{
           
            .box{
                float: left;
                width: 138px;
                height: 70px;
                border-radius: 5px;
                overflow: hidden;
                color: #fff;
                display: block;
                margin: 10px 8px 0 0;
                line-height: 70px;
                font-size: 14px;
                text-align: center;
                img{
                   display: inline-block;
                   vertical-align: middle;
                   margin: -2px 5px 0 0;
                   max-width: 30px;
                }
                &:nth-child(2n){
                   margin-right: 0px;
                }
   
   
             }
             .box1{background: #6300bf;}
             .box2{background: #027db4;}
        }
    }
    .indexADD8-2{
        width: 880px;
        .indexADD8-2-1{
            .list{
                li{
                    height: 30px;
                    line-height: 30px;
                    overflow: hidden;
                    display: flex;
                    padding: 2px 0;
                    .img{
                        width: 155px;
                        height: 117px;
                        display: none;
                        border-radius: 5px;
                        overflow: hidden;
                    }
                    .infor{
                        flex: 1;
                        overflow: hidden;
                        .name{
                            height: 30px;
                            line-height: 30px;
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                            display: block;
                            width: 100%;
                            &::before{
                                content: '';
                                width: 2px;
                                height: 2px;
                                display: inline-block;
                                vertical-align: middle;
                                background: #333;
                                opacity: 0.5;
                                margin: -2px 8px 0 0;
                            }
                        }

                    }
                    .time{
                        font-size: 12px;
                        opacity: 0.7;
                    }
                    &.on{
                       height: 117px;
                       padding: 5px 0 10px;
                       .img{
                        display: block;
                       }
                       .infor{
                           padding-left: 15px;
                           .name{
                            font-weight: bold;
                            height: auto;
                            white-space: normal;
                            height: 44px;
                            line-height: 22px;
                            display: -webkit-box; -webkit-line-clamp: 2; 
                            -webkit-box-orient: vertical; word-break: break-all;   
                            &::before{
                                display: none;
                            }  

                           }
                           .tex{
                            padding-top: 5px;
                            font-size: 12px;
                            line-height: 22px;
                            height: 66px;
                            overflow: hidden;
                            display: -webkit-box; -webkit-line-clamp: 3; 
                            -webkit-box-orient: vertical; word-break: break-all;     

                           }
                       }
                       .time{
                        display: none;
                       }
                    }

                }
            }
            .box1{
                width: 520px;
            }
            .box2{
                width: 340px;
                  .list li.on .infor {
                    .name{
                        -webkit-line-clamp: 1;
                        height: 22px;
                        
                    }
                    .tex{
                        -webkit-line-clamp: 4;
                        height: 88px;
                    }
                  }
            }
        }
        .indexADD8-2-2{
            .lunbox{
                position: relative;
                border-radius: 5px;
                overflow: hidden;
                height: 70px;
                margin-top: 10px;
                .prev{left: 5px;}
                .next{right: 5px;}
                .bd{
                    height: 100%;
                    li{
                        height: 70px;
                        width: 316px;
                        margin-right: 30px;
                        .img{
                            width: 100%;
                            height: 70px;
                            overflow: hidden;
                            position: relative;
                            border-radius: 5px;
                            display: block;
                            color: #fff;
                            &:hover{
                                .motai{
                                    .bt{
                                        color: #007bff;
                                        text-decoration: underline;
                                    }
                                    text-decoration: underline;
                                   
                                   
                                }
                                
                            }
                            .motai{
                                position: absolute;
                                top: 0;
                                left: 0;
                                width: 100%;
                                height: 100%;
                                background: rgba(0, 0, 0, 0.5);
                                text-align: center;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                .tex{
                                    padding: 0 20px;
                                }
                                .bt{
                                    height: 20px;
                                    line-height: 20px;
                                    font-weight: bold;
                                    padding-bottom: 5px;
                                    overflow: hidden;
                                }
                                .p{
                                    font-size: 12px;
                                    line-height: 18px;
                                    overflow: hidden;
                                    max-height: 36px;
                                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;     

                                }

                            }
                        }
                    }
                }
            }
        }
    }
}
.indexADD9{
    .indexADD9-1{
        width: 285px;
        .list{
            width: 100%;
            .lis{
                display: block;
                line-height: 34px;
                overflow: hidden;
                width: 100%;
                white-space: nowrap;
                text-overflow: ellipsis;

            }
        }
    }
    .indexADD9-2{
        width: 380px;
        padding-left: 20px;
        .list{
            padding-top: 5px;
            .box{
                display: block;
                float: left;
                width: 180px;
                margin: 5px 20px 5px 0;
                &:nth-child(2n){
                    margin-right: 0px;
                }
                .img{
                    width: 100%;
                    height: 110px;
                    border-radius: 5px;
                    overflow: hidden;
                }
                .name{
                    overflow: hidden;
                    height: 44px;
                    line-height: 22px;
                    padding-top: 5px;
                    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;

                }

            }
        }
    }
    .indexADD9-3{
        width: 480px;
        .list{
            padding-bottom: 20px;
            .box{
                width: 86px;
                height: 54px;
                display: block;
                float: left;
                border-radius: 5px;
                line-height: 54px;
                font-size: 12px;
                color: #fff;
                margin: 10px 12px 0 0;
                background: #007bff;
                text-align: center;
                &:nth-child(5n){
                    margin-right: 0px;
                }
                .img{
                    background: none;
                    display: inline-block;
                    vertical-align: middle;
                    margin: -2px 5px 0 0;
                    min-width: 15px;
                    min-height: 15px;
                    max-width: 25px;

                }
            }
            .box1{background: #4b7902;}
            .box2{background: #a30014;}
            .box3{background: #000080;}
            .box4{background: #027db4;}
            .box5{background: #333333;}
            .box6{background: #b8741a;}
            .box7{background: #70b603;}
            .box8{background: #000000;}
            .box9{background: #420080;}
        }
        .list2{
           .box{
            width: 146px;
            height: 85px;
            display: block;
            position: relative;
            overflow: hidden;
            border-radius: 5px;
            float: left;
            margin: 10px 20px 0 0;
            color: #fff;
            &:hover{
                .motai{
                    text-decoration: underline;
                }
            }
            &:nth-child(3n){
                margin-right: 0px;
            }
            .motai{
                position: absolute;
                top: 0;
                left: 0px;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.6);
                display: flex;
                align-items: center;
                justify-content: center;
                span{
                    padding: 0 10px;
                    line-height: 20px;
                }


            }

           }   
        }
    }
}
.indexADD10{
    .warp{
        padding: 10px 0;
        ul{
            display: flex;
            li{
                flex: 1;
                border-right: 1px solid rgba(0, 0, 0, 0.1);
                margin-right: 10px;
                padding-right: 10px;
                &:last-child{
                    padding-right: 0;
                    margin-right: 0;
                    border:none;
                }
                .Iaddtitle{
                    height: 20px;
                    line-height: 20px;
                }
                .list{
                    width: 100%;
                    overflow: hidden;
                    .lis{
                        width: calc(100% + 20px);
                        overflow: hidden;
                        .box{
                            background: rgba(0, 0, 0, 0.05);
                            height: 41px;
                            padding: 0 2px;
                            width: 70px;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            border-radius: 5px;
                            margin: 10px 15px 10px 0;
                            text-align: center;
                            float: left;
                            overflow: hidden;
                            span{
                                max-height: 36px;
                                line-height: 18px;
                                overflow: hidden;
                            }
                            &:hover{
                                background: #e5f2ff;
                            }
                            

                        }
                    }
                }
            }
            .li1{
                width: 145px;
                flex: none;
                .list{
                    .lis{
                        width: 100%;
                        .box{
                            margin-right: 0px;
                            width: 141px;
                        }
                    }
                }
            }
            .li3{
                flex: none;
                width: 295px;
                .list{
                    .lis{
                        .box{
                            width: 84px;
                        }
                    }
                }
            }

        }
    }
}
.layertipsindextop{
    padding: 0;
    .layui-layer-content{
        padding: 8px !important;
        color: #222;
        border:1px solid rgba(0, 0, 0, 0.1)
    }
    .Cont1{
        .text{
            color: #333;
            font-size: 14px;
        }
        .tabbox{
            .tab{
                line-height: 20px;
                font-size: 12px;
                height: 20px;
                padding: 0 5px;
                i{
                    transform: scale(0.8);
                }
            }
        }
    }
}